import React, { Fragment } from 'react';
import { Card, Content, Icon } from 'react-fule-ui';
import './index.scss';
// 代码块
import CMarkdown from './../../components/CMarkdown';
// 数据
import { Demo } from './demo.js';

export default function FullIcon() {
  return (
    <Fragment>
      <Content>
        <Content.Header>Icon</Content.Header>
        <Content.Body>
          <Card>
            <Card.Header>有hover态 Icon</Card.Header>
            <Card.Body>
              <Icon type="date" hover size="16" />
              <Icon type="close" hover size="16" />
              <Icon type="drop" hover size="16" />
              <Icon type="arrow" hover size="16" />
              <Icon type="checked" hover size="16" />
              <Icon type="setting" hover size="16" />
              <Icon type="refresh" hover size="16" />
              <Icon type="customerService" hover size="16" />
              <Icon type="backUp" hover size="16" />
              <Icon type="arrowRight" hover size="16" />
              <Icon type="logoDorpdown" hover size="16" />
              <Icon type="star" hover size="16" />
              <Icon type="starHalf" hover size="16" />
              <Icon type="starEmpty" hover size="16" />
            </Card.Body>
          </Card>
          <Card>
            <Card.Header>无hover态 Icon</Card.Header>
            <Card.Body>
              <Icon type="file" size="16" />
              <Icon type="pdf" size="16" />
              <Icon type="word" size="16" />
              <Icon type="ppt" size="16" />
              <Icon type="exp" size="16" />
              <Icon type="video" size="16" />
              <Icon type="excel" size="16" />
              <CMarkdown data={Demo} style={{ marginTop: '16px' }} />
            </Card.Body>
          </Card>
        </Content.Body>
      </Content>
    </Fragment>
  );
}
